<?
include_once '../includes/config.php';
include_once '../includes/parcial.php';

$tServicios = new TratamientoServicios();
$tratamientos = $tServicios->listarKeyValuesHabilitados();
$fecha_actual = date("d/m/Y");
?>
<div id="contenedorNuevaReserva">
  <br/>
  <form accept-charset="utf-8" id="formBuscador" action="">
    <div class="contenedorBotones">
      <?
      //echo Helper::botonJquery('agregar', 'agregarEventual', 'Agregar');
      echo Helper::botonJquery('cancelar', 'cancelar', 'Cancelar');
      ?>
    </div>
    <div class="contenedorModulos">
      <div class="filtros">
        <?
        echo Helper::entradaTextoVerticalChica("Fecha Desde", "70", $fecha_actual, 'fecha_desde');
        echo Helper::entradaTextoVerticalChica("Cant. Días", "70", 7, 'cant_dias');
        ?>
        <div class="entradaVerticalChica buscadorFecha">
          <label class="etiquetaAbm">Tratamiento</label><br/>
          <select style="width: 150px;" id="tratamiento" name="tratamiento">
            <option value="">Seleccione</option>
            <?php
            for ($i = 0; $i < count($tratamientos); $i++)
            {
              ?>
              <option value="<?php echo $tratamientos[$i]["key"]; ?>"><?php echo $tratamientos[$i]["value"]; ?></option>
              <?php
            }
            ?>
          </select>
        </div>
        <div class="entradaVerticalChica">
          <?= Helper::botonJquery("buscador", "buscador", "Buscar"); ?>
        </div>
      </div>
    </div>             
  </form>
</div>
<script type="text/javascript">          
  $(document).ready(function(){
    $("#tope").html("");
    $("#contenedorNuevaReserva").appendTo("#tope");
    $("#tope").show();
    $("#cant_dias").mask("9?9");
    $("#formBuscador").validate(
    {
      rules: 
        { 
        fecha_desde: "required",
        tratamiento: "required",
        cant_dias: "required"
      },
      messages: 
        {
        fecha_desde: "*",
        tratamiento: "*",
        cant_dias: "*"
      }
    });
    $(".horaResBusqueda").live("click", function(){
      var data = $(this).data("val");
      var tratamiento = $("#tratamiento").val();
      var target = "nuevaReserva.php";                    
//      $("#tope").slideUp(1);
      $("#cuerpo").load(target, {fecha: data, tratamiento: tratamiento }, function(){
        $("#tope").html("");
        $("#contenedorNuevaReserva").appendTo("#tope");
//        $("#tope").height(200);
        $("#tope").show();
      });   
    });
    $("#buscador").click(function(event){
      event.preventDefault();
      if ( $("#formBuscador").validate().form()){
        var fecha = $("#fecha_desde").val();
        var fechaObj = Date.parseString(fecha, "dd/MM/yyyy");
        var cantDias = $("#cant_dias").val();
        var idTratamiento = $("#tratamiento").val();
        $.blockUI();
        $.ajax({
          type: "POST",
          url: "buscarHorariosDisponibles.php",
          data: {fecha: $.datepicker.formatDate( $.datepicker.ISO_8601, fechaObj),cantDias: cantDias, idTratamiento: idTratamiento},
          success: function(data){
            if (data=="0"){
              $.unblockUI();
              $.growlUI('No se pudo realizar la busqueda, complete todos los campos.'); 
            } 
            else
            {              
              $("#contenedorResBusqueda").remove();
              var fechasDispo = $.parseJSON(data)
              var html = "<div class='contentGrillaTratamiento'><div class='grillaTratamientoFecha'>Fecha</div><div class='grillaHorarioFecha'>Horarios</div><div>";
              html += "<div id='contenedorResBusqueda'>";
              if(fechasDispo.length == 0){
                html += 'No se encontraron turnos disponibles, intente con otras fechas.'; 
              } else {
                var fechaAnterior = fechasDispo[0].fecha;
                html += "<div class='fechaResBusqueda'>" + fechaAnterior + "</div>";
                for (i=0;i<fechasDispo.length;i++){
                  if (fechasDispo[i].fecha != fechaAnterior) {
                    html += "<div class='fechaResBusqueda'>" + fechasDispo[i].fecha + "</div>";
                  }
                  html += "<div class='horaResBusqueda' data-val='"+ fechasDispo[i].fecha + "-" + fechasDispo[i].hora + "'>" + fechasDispo[i].hora + "</div>";
                  fechaAnterior = fechasDispo[i].fecha;
                }
              }
              html += "</div>";
              $("#cuerpo").append(html);
              $.unblockUI();
            }
          }
        });
      }
      else{
        $.growlUI('Complete los campos obligatorios..'); 
      }
    });
    $("#tope").height(180);
    $('#fecha_desde').datepicker( {
      dateFormat: 'dd/mm/yy',
      changeMonth: true,
      changeYear: true,
      showButtonPanel: true,
      closeText: "Cerrar"
      
    });
  });
</script>